<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>权限管理系统－权限管理</title>
<script type="text/javascript" src="${resurl}/js/jquery.js"></script>
<script src="${resurl}/js/bootstrap.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="${resurl}/css/bootstrap.min.css">
<link rel="stylesheet" href="${resurl}/css/common.css">
<script type="text/javascript">
$(document).ready(function(){
	//获取功能列表
	$.post("${resurl}/funcinfovalid.pms",{},function(data,status){
		$.each(data,function(index,func){
				$("ul#funclist").append("<li class=\"li-button\"><button id=\""
					+func.func_id
					+"\" name=\"funclist_btn\" class=\"btn btn-sm btn-info btn-block\" type=\"button\" onclick=\"funcbtn_click(this);\">"
					+func.func_name
					+"</button></li>");
		});
	});
	//打开新增权限用户列表模式窗口
	$("button#addperm_btn").click(function(){
		var func_id=$("input:hidden#currentClickButton").val();
		$.post("${resurl}/userinfowithoutperm.pms",{func_id:func_id},function(data,status){
			$("tbody#userinfobody").text("");
			$.each(data,function(index,user){
				$("tbody#userinfobody").append(
						"<tr>"
						+"<td><input id=\"user_info\" name=\"modal_user_id\" type=\"checkbox\" value=\""
						+user.user_id
						+"\"/></td>"
						+"<td>"
						+user.user_name
						+"</td>"
						+"<td><input id=\"perm_1\" name=\"modal_perm_"
						+user.user_id
						+"\" type=\"checkbox\" value=\"1\"/></td>"
						+"<td><input id=\"perm_2\" name=\"modal_perm_"
						+user.user_id
						+"\" type=\"checkbox\" value=\"2\"/></td>"
						+"<td><input id=\"perm_4\" name=\"modal_perm_"
						+user.user_id
						+"\" type=\"checkbox\" value=\"4\"/></td>"
						+"</tr>"
				);
			});
		});
	});
	//点击保存按钮
	$("button#modal_addperm_btn").click(function(){
		var func_id=$("input:hidden#currentClickButton").val();
		$("input[name='modal_user_id']:checked").each(function(index){
			var user_id=$(this).val();
			var perm_nos=[];
			$("input[name='modal_perm_"+user_id+"']:checked").each(function(index){
				perm_nos[index]=$(this).val();
			});
			if(perm_nos.length>0){
				savePerm(func_id,user_id,perm_nos);
			}
		});
		closeModal("addperm_modal");
		showPermList(func_id);
	});
	
	//点击修改按钮
	$("button#updateperm_btn").click(function(){
		$("input:checkbox[name='list_perm_id']:checked").each(function(index){
			var perm_id=$(this).val();
			var perms=[];
			$("input:checkbox[name='list_perm_"+perm_id+"']:checked").each(function(index){
				perms[index]=$(this).val();
			});
			updatePerm(perm_id,perms);
			
		});
		var current_btn_id=$("input:hidden#currentClickButton").val();
		showPermList(current_btn_id);
	});
	//点击删除按钮
	$("button#deleteperm_btn").click(function(){
		$("input:checkbox[name='list_perm_id']:checked").each(function(index){
			var perm_id=$(this).val();
			$.ajax({url:"${resurl}/permdelete.pms",type:"POST",async:false,data:{perm_id:perm_id},success:function(datat,status){
				
			}});
		});
		var current_btn_id=$("input:hidden#currentClickButton").val();
		showPermList(current_btn_id);
	});
	
});
//选中button 获取数据并改变button的样式，将buttonid绑定到隐藏域
function funcbtn_click(button){
	var button_id=$(button).attr("id");
	var current_btn_id=$("input:hidden#currentClickButton").val();
	if(current_btn_id!=null&&current_btn_id!=""){
		$("button#"+current_btn_id).attr("class","btn btn-sm btn-info btn-block");
	}
	$("input:hidden#currentClickButton").attr("value",button_id);
	$("button#"+button_id).attr("class","btn btn-sm btn-warning btn-block");
	showPermList(button_id);
	
}
//保存权限
function savePerm(func_id,user_id,perm){
	$.ajax({url:"${resurl}/perminsert.pms",type:"POST",async:false,data:{func_id:func_id,user_id:user_id,perm_no:perm},success:function(dtat,status){
	}});
}

//修改权限
function updatePerm(perm_id,perm){
	$.ajax({url:"${resurl}/permupdate.pms",type:"POST",async:false,data:{perm_id:perm_id,perm_no:perm},success:function(dtat,status){
	}});
}

//显示当前节点的权限列表
function showPermList(func_id){
$.post("${resurl}/perminfo.pms",{func_id:func_id},function(data,status){
	$("tbody#userlist").text("");
	$.each(data,function(index,user){
		$("tbody#userlist").append(
				"<tr>"
				+"<td><input id=\"perm_info\" name=\"list_perm_id\" type=\"checkbox\" value=\""
				+user.perm_id
				+"\"/></td>"
				+"<td>"
				+user.user_name
				+"</td>"
				+"<td><input id=\"perm_1\" name=\"list_perm_"
				+user.perm_id
				+"\" type=\"checkbox\" value=\"1\" "
				+user.perm_1
				+"/></td>"
				+"<td><input id=\"perm_2\" name=\"list_perm_"
				+user.perm_id
				+"\" type=\"checkbox\" value=\"2\" "
				+user.perm_2
				+"/></td>"
				+"<td><input id=\"perm_4\" name=\"list_perm_"
				+user.perm_id
				+"\" type=\"checkbox\" value=\"4\" "
				+user.perm_4
				+"/></td>"
				+"</tr>"
		);
	});	
});
}
//关闭模式窗口
	function closeModal(modal){
		$("div#"+modal).attr("class","modal fade").attr("style","display: none;").attr("aria-hidden","true");
		$("div.modal-backdrop.fade.in").remove();
		$("body").attr("class","");
	}
</script>
</head>
<body>
	<input id="currentClickButton" type="hidden" value=""/>
	<nav class="navbar navbar-inverse navbar-fixed-top">
		<div class="container-fluid">
			<div class="navbar-header">
				<button type="button" class="navbar-toggle collapsed"
					data-toggle="collapse" data-target="#navbar" aria-expanded="false"
					aria-controls="navbar">
					<span class="sr-only">Toggle navigation</span> <span
						class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="${resurl }/index.pms">权限管理系统</a>
			</div>
			<div id="navbar" class="navbar-collapse collapse">
				<ul class="nav navbar-nav navbar-right">
					<li><a href="#">设置</a></li>
					<li><a href="#">个人资料</a></li>
					<li><a href="#">帮助</a></li>
				</ul>
				<form class="navbar-form navbar-right">
					<input type="text" class="form-control" placeholder="查询...">
				</form>
			</div>
		</div>
	</nav>

	<div class="container-fluid">
		<div class="row">
			<div class="sidebar">
				<ul class="nav nav-sidebar">
					<li><a href="${resurl }/index.pms">首页</a></li>
					<li><a href="${resurl}/userindex.pms">用户管理</a></li>
					<li><a href="${resurl}/deptindex.pms">部门管理</a></li>
					<li  class="active"><a href="${resurl }/permindex.pms">权限管理<span class="sr-only">(current)</span></a></li>
					<li><a href="${resurl }/funindex.pms">功能管理</a></li>
				</ul>
			</div>
			<div class="treeview" id="funcview">
			<h2 class="sub-header">功能列表</h2>
			
			<ul id="funclist" class="nav nav-sidebar">
			</ul>
			</div>
			<div class="deptmain">
				<h2 class="sub-header">权限列表</h2>
				<div id="operator" class="navbar-collapse collapse operation">
					<ul class="nav navbar-nav navbar-right">
						<li class="li-button"><button id="addperm_btn" class="btn btn-sm btn-success btn-block" type="button" data-toggle="modal" data-target="#addperm_modal">新增</button></li>
						<li class="li-button"><button id="updateperm_btn"  class="btn btn-sm btn-warning btn-block" type="button">修改</button></li>
						<li class="li-button"><button id="deleteperm_btn" class="btn btn-sm btn-danger btn-block" type="button">删除</button></li>
					</ul>
				</div>
				<div class="table-responsive">
					<table class="table table-striped">
						<thead>
							<tr>
								<th rowspan="2">选择</th>
								<th rowspan="2">用户</th>
								<th>权限</th>
							</tr>
							<tr>
								<th>编辑</th>
								<th>审核</th>
								<th>发布</th>
							</tr>
						</thead>
						<tbody id="userlist">
							<tr>
						
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
	
	<!-- 从这里开始全都是模式窗口。注意哦 -->
	
	<div class="modal fade" id="addperm_modal" tabindex="-1" role="dialog" aria-labelledby="addpermModelLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 id="addperm_modal_title" class="modal-title">选择用户</h4>
				</div>
				<div class="modal-body">
					<table class="table table-striped">
						<thead>
						<tr>
								<th rowspan="2">选择</th>
								<th rowspan="2">用户</th>
								<th>权限</th>
							</tr>
							<tr>
								<th>编辑</th>
								<th>审核</th>
								<th>发布</th>
							</tr>
						</thead>
						<tbody id="userinfobody">
						<tr>
						<td><input id="user_info" name="modal_user_id" type="checkbox" value=""/></td>
						<td>yonghu1</td>
						<td><input id="perm_1" name="modal_perm_id" type="checkbox" value="1"/></td>
						<td><input id="perm_2" name="modal_perm_id" type="checkbox" value="2"/></td>
						<td><input id="perm_4" name="modal_perm_id" type="checkbox" value="4"/></td>
						</tr>
						</tbody>
					</table>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭
					</button>
					<button id="modal_addperm_btn" type="button"
						class="btn btn-primary">添加</button>
				</div>
			</div>
		</div>
	</div>
</body>
</html>
